<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>首页</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="swiper-bundle.min.css" />
<link rel="stylesheet" type="text/css" href="newbook.css">
<style type="text/css">
  body{
    width: 1200px;
    height: 1005px;
  }
  a{
    text-decoration:none; 
    font-size: large;
    
} 
.con {
  position:fixed;
  top:0;
  left:0;
  width:100%;
  padding:5px;
  width: 100%px;
    height: 40px;
    background-color:#4c5e69;
    transition-delay: 0.15s;
    border-bottom: 10px solid #4c5e69;
}
.con .left li a{
    color:black;
    font-size: large;
}
 a:link{
    color:black;
} 
 a:visited{
    color:black;
}
 a:hover{
    text-decoration: underline;
} 
 a:active{
    color:rgb(193, 41, 41);
}

.con .left{
    margin:auto;
}
 .con .left li{
    width:180px;
    float:left;
    height:50px;
    line-height:50px;
    margin-right:50px;
    color:white;
    cursor:pointer;
    list-style: none;}
footer {  
        background-color: #f2f2f2;  
        padding: 20px 0;  
        text-align: center;  
        font-size: 14px;  
      }  
/* 友情链接样式 */  
.friend-links {  
            list-style: none;  
            padding: 0;  
            margin: 10px 0 0 0; /* 顶部外边距与版权信息分隔 */  
        }  
    
 .friend-links li {  
            display: inline-block;  
            margin-right: 10px; /* 链接之间的间距 */  
        }  
    
.friend-links li:last-child {  
            margin-right: 0; /* 最后一个链接没有右边距 */  
        }  
    
.friend-links a {  
            text-decoration: none; /* 去除下划线 */  
            color: #666; /* 链接颜色 */  
        }  
    
.friend-links a:hover {  
            color: #333; /* 链接悬停时的颜色 */  
        }  
 
[type=text]{
    width: 400px;height: 60px;margin: 20px;font-size: 25px;margin-top: 50px;
    text-indent: 12px;border: 1px solid rgb(150,145,145);border-radius: 8px;
}
[type=submit]{
    width: 120px;height: 60px;background-color: cadetblue;margin-top: 50px;
    border: 1px solid rgb(146,193,195);font-size: 23px;color: aliceblue;border-radius: 5px;
}
.b{width:280;height: 380px;display:inline-block;}
.c{width:1500px;height:600px;}
.d{width:280;height:380;display:inline;}
.t{
    /* border: 1px solid black; */
    display: flex; 
    width: 100%;
    height: 380px; 
}
.t img{
    width: 1800px;
    height: 380px; 
}

.o{
   
   height: 200px;
   position: relative;
  top: 52px;
}
.o1{
  
    width:400px;
    height:150px;
    position: absolute;
    left: 80px;
}
.o2{
    
    width:800px;
    height:150px;
    position: absolute;
    right: -300px;
    
}
.e{width:280;height:380;display:inline-block;}
.g p{text-align: center;}
.c li{margin-left: 20px;
    width:180px;
    float:left;
    height:50px;
    line-height:50px;
    margin-right:50px;
    color:black;
    cursor:pointer;
    list-style: none;}
.l{font-size: 36px;color: #033;}
.l1{font-size: 25px;color:green;}
.newbook{
/* display: inline-block; */
    /* all: initial; */
    width: 1200px;
    height: 600px;
}


</style>
</head>

<body>
<!-- <header id="head"> -->

<div class="con">
    <ul class="left">
<li><a href="#">首页</a></li>
<li><a href="gongdu.html">共读空间</a></li>
<li><a href="register.html">登录/注册</a></li>
</ul>
</div>
<!-- </header> -->
<div class="o">
    <div class="o1">
        <img src="img/logo3.jpg" >
    </div>
    <div class="o2">
        <input type="text" name="id" placeholder="作者/书名">
        <input type="submit" value="GO">
    </div>
</div>
<div class="t"><img src="img/38.jpg" ></div>

<div class="newbook">
  <div id="main">
    <div class="section ">
      <div class="hd" id="dao">
         <h2 class="h2" id="week"> 每周新书 </h2> 
         <div class="tags" id="mu">
          <span class="item-all" id="quan">
            <a href="shouye.html" >全部</a>
          </span>
          <span class="item  " id="emm">
            <a href="ye1.html">文学</a>
          </span>
          <span class="item " id="emm">
            <a href="ye2.html">小说</a>
          </span>
          <span class="item " id="emm">
            <a href="ye3.html">历史文化</a>
          </span>
          <span class="item " id="emm">
            <a href="ye4.html">社会纪实</a>
          </span>
          <span class="item " id="emm">
            <a href="ye5.html">科学新知</a>
          </span>
          <span class="item " id="emm">
            <a href="ye6.html">艺术设计</a>
          </span>
          <span class="item " id="emm">
            <a href="ye7.html">商业经管</a>
          </span>
          <span class="item " id="emm">
            <a href="ye8.html">绘本漫画</a>
          </span>
      </div>
          <span class="link-more" id="ooo">
            <a href="more.html" target="_blank">更多»</a>
          </span>
      </div>
    <!-- Swiper轮播 -->
    <div class="swiper mySwiper" id="sw">
      <div class="swiper-wrapper">
        <div class="swiper-slide" id="sw-slide">
          <ul>
           <li>
             <div class="tupian">
               <a href="demo41.html" title="为你着迷"><img src="images/为你着迷.png" alt="为你着迷"></a>
             </div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo41.html" title="为你着迷">为你着迷</a>
               </div>
               <div class="author" id="zou">(日)和山山</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo42.html" title="内陆之行">
               <img src="images/内陆之行.png" alt="内陆之行"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo42.html" title="内陆之行">内陆之行</a>
               </div>
               <div class="author" id="zou">[奥] 彼得·汉德克</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo43.html" title="食南之徒">
               <img src="images/食南之徒.png" alt="食南之徒"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo43.html" title="食南之徒">食南之徒</a>
               </div>
               <div class="author" id="zou">马伯庸</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo44.html" title="阿勒泰的角落">
               <img src="images/阿勒泰的角落.png" alt="阿勒泰的角落"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo44.html" title="阿勒泰的角落">阿勒泰的角落</a>
               </div>
               <div class="author" id="zou"> 李娟</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo45.html" title="我们八月见">
               <img src="images/我们八月见.png" alt="我们八月见"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo45.html" title="我们八月见">我们八月见</a>
               </div>
               <div class="author" id="zou">加西亚·马尔克斯</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo46.html" title="唯余细节">
               <img src="images/唯余细节.png" alt="唯余细节"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo46.html" title="唯余细节">唯余细节</a>
               </div>
               <div class="author" id="zou"> [瑞典] 伊娅·根伯格</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo47.html" title="鳄鱼">
               <img src="images/鳄鱼.png" alt="鳄鱼"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo47.html" title="鳄鱼">鳄鱼</a>
               </div>
               <div class="author" id="zou"> 莫言</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo48.html" title="绿灯">
               <img src="images/绿灯.png" alt="绿灯"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo48.html" title="绿灯">绿灯</a>
               </div>
               <div class="author" id="zou">[美]马修·麦康纳</div>
             </div>
           </li>
        </ul>
        </div>
        <div class="swiper-slide" id="sw-slide">
          <ul>
           <li>
             <div class="tupian">
               <a href="demo49.html" title="联愁杀"><img src="images/联愁杀.png" alt="联愁杀"></a>
             </div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo49.html" title="联愁杀">联愁杀</a>
               </div>
               <div class="author" id="zou">[日]西泽保彦</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo50.html" title="请记得乐园">
               <img src="images/请记得乐园.png" alt="请记得乐园"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo50.html" title="请记得乐园">请记得乐园</a>
               </div>
               <div class="author" id="zou"> 那多</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo51.html" title="一生悬命">
               <img src="images/一生悬命.png" alt="一生悬命"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo51.html" title="一生悬命">一生悬命</a>
               </div>
               <div class="author" id="zou">陆春吾</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo52.html" title="第七重解答">
               <img src="images/第七重解答.png" alt="第七重解答"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo52.html" title="第七重解答">第七重解答</a>
               </div>
               <div class="author" id="zou"> [法] 保罗·霍尔特</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo53.html" title="吃着吃着就老了">
               <img src="images/吃着吃着就老了.png" alt="吃着吃着就老了"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo53.html" title="吃着吃着就老了">吃着吃着就老了</a>
               </div>
               <div class="author" id="zou">陈晓卿</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo54.html" title="我比世界晚熟">
               <img src="images/我比世界晚熟.png" alt="我比世界晚熟"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo54.html" title="我比世界晚熟">我比世界晚熟</a>
               </div>
               <div class="author" id="zou"> 胡安焉</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo55.html" title="解闷儿">
               <img src="images/解闷儿.png" alt="解闷儿"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo55.html" title="解闷儿">解闷儿</a>
               </div>
               <div class="author" id="zou"> 张辰亮</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo56.html" title="巴别塔">
               <img src="images/巴别塔.png" alt="巴别塔"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo56.html" title="巴别塔">巴别塔</a>
               </div>
               <div class="author" id="zou"> [美] 匡灵秀</div>
             </div>
           </li>
        </ul>
        </div>
        <div class="swiper-slide" id="sw-slide">
          <ul>
           <li>
             <div class="tupian">
               <a href="demo57.html" title="早安，怪物"><img src="images/早安，怪物.png" alt="早安，怪物"></a>
             </div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo57.html" title="早安，怪物">早安，怪物</a>
               </div>
               <div class="author" id="zou">凯瑟琳·吉尔迪纳</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo58.html" title="我的心吱吱叫">
               <img src="images/我的心吱吱叫.png" alt="我的心吱吱叫"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo58.html" title="我的心吱吱叫">我的心吱吱叫</a>
               </div>
               <div class="author" id="zou"> [日]胃下舌咪</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo59.html" title="孔雀菩提">
               <img src="images/孔雀菩提.png" alt="孔雀菩提"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo59.html" title="孔雀菩提">孔雀菩提</a>
               </div>
               <div class="author" id="zou">焦典</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo60.html" title="孤星之旅">
               <img src="images/孤星之旅.png" alt="孤星之旅"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo60.html" title="孤星之旅">孤星之旅</a>
               </div>
               <div class="author" id="zou">周文翰</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo61.html" title="魔术师">
               <img src="images/魔术师.png" alt="魔术师"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo61.html" title="魔术师">魔术师</a>
               </div>
               <div class="author" id="zou">[爱尔兰] 科尔姆·托宾</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo62.html" title="小说的细节">
               <img src="images/小说的细节.png" alt="小说的细节"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo62.html" title="小说的细节">小说的细节</a>
               </div>
               <div class="author" id="zou">黄昱宁</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo63.html" title="老实好人">
               <img src="images/老实好人.png" alt="老实好人"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo63.html" title="老实好人">老实好人</a>
               </div>
               <div class="author" id="zou">顾湘</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo64.html" title="赶时间的人">
               <img src="images/赶时间的人.png" alt="赶时间的人"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo64.html" title="赶时间的人">赶时间的人</a>
               </div>
               <div class="author" id="zou"> 王计兵</div>
             </div>
           </li>
        </ul>
        </div>
        <div class="swiper-slide" id="sw-slide">
          <ul>
           <li>
             <div class="tupian">
               <a href="demo1.html" title="暗处的女儿"><img src="images/暗处的女儿.png" alt="暗处的女儿"></a>
             </div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo1.html" title="暗处的女儿">暗处的女儿</a>
               </div>
               <div class="author" id="zou">[意大利] 埃莱娜·费兰特</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo2.html" title="亲密关系的核心是友谊">
               <img src="images/亲密关系的核心是友谊.png" alt="亲密关系的核心是友谊"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo2.html" title="亲密关系的核心是友谊">亲密关系的核心是友谊</a>
               </div>
               <div class="author" id="zou">汪民安</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo3.html" title="移民路上的生与死">
               <img src="images/移民路上的生与死.png" alt="移民路上的生与死"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo3.html" title="移民路上的生与死">移民路上的生与死</a>
               </div>
               <div class="author" id="zou">[美] 杰森·德莱昂</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo4.html" title="一个人消失在世上">
               <img src="images/一个人消失在世上.png" alt="一个人消失在世上"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo4.html" title="一个人消失在世上">一个人消失在世上</a>
               </div>
               <div class="author" id="zou"> [意] 亚历山德罗·巴里科</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo5.html" title="坐一望三">
               <img src="images/坐一望三.png" alt="坐一望三"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo5.html" title="坐一望三">坐一望三</a>
               </div>
               <div class="author" id="zou"> 阿坚</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo6.html" title="立秋">
               <img src="images/立秋.png" alt="立秋"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo6.html" title="立秋">立秋</a>
               </div>
               <div class="author" id="zou">杜阳林</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo7.html" title="钦探">
               <img src="images/钦探.png" alt="钦探"></a></div>
             <div class="info"id="shu">
               <div class="title" id="biao">
                 <a href="demo7.html" title="钦探">钦探</a>
               </div>
               <div class="author" id="zou"> 周游</div>
             </div>
           </li>
           <li>
             <div class="tupian"><a href="demo8.html" title="从数学到哲学">
               <img src="images/从数学到哲学.png" alt="从数学到哲学"></a></div>
             <div class="info" id="shu">
               <div class="title" id="biao">
                 <a href="demo8.html" title="从数学到哲学">从数学到哲学</a>
               </div>
               <div class="author" id="zou"> [美] 王浩</div>
             </div>
           </li>
        </ul>
        </div>
      </div>
      <div class="swiper-pagination"></div>
    </div>
    </div>
  </div>
</div>
   
    



<div>
<h2>
<span class="l">每周推荐</span>
<span> <a href="1.html">文学</a></span>
<span><a href="2.html">推理/悬疑</a></span>
<span><a href="3.html">科幻</a></span>
</h2><hr />
</div>
<div class="c">
<ul>
<li>
<div class="b"><a href="book.html"><img src="img/27.jpg" /></a>
<div class="g"><a href="book.html"><p class="l1">恶意</p></a>
<p><img src="img/46.PNG" /></p>
<p>作者：东野圭吾</p></div></div>
</li>
<li>
<div class="b"><a href="book2.html"><img src="img/35.jpg" width="250" height="360" /></a>
<div  class="g"><a href="book2.html"><p class="l1">后山开花</p></a>
<p><img src="img/43.PNG" /></p>
<p>作者：余秀华</p></div></div>
</li>
<li><div class="b"><a href="book3.html"><img src="img/25.jpg" width="250" height="360"/></a>
<div class="g"><a href="book3.html"><p class="l1">沙丘</p></a>
<p><img src="img/44.PNG" /></p>
<p>作者：弗兰克.赫伯特</p></div></li>
<li>
<div class="b"><a href="book4.html"><img src="img/34.jpg" width="250" height="360"></a>
<div class="g"><a href="book4.html"><p class="l1">无人生还</p></a>
<p><img src="img/44.PNG"></p>
<p>作者：阿加莎.克里斯蒂</p>
</div></div>
</li>
<li>
<div class="b"><a href="book5.html"><img src="img/32.jpg" width="250" height="360"></a>
<div class="g"><a href="book5.html"><p class="l1">新参者</p></a>
<p><img src="img/44.PNG"></p>
<p>作者：东野圭吾</p></div>
</li>
</div>
<div class="c"><ul>
<li>
<div class="e"><a href="book6.html"><img src="img/39.jpg" width="250" height="360"></a>
<div class="g"><a href="book6.html"><p class="l1">在细雨中呼喊</p></a>
<p><img src="img/43.PNG"></p>
<p>作者：余华</p></div>
</div>
</li>
<li>
    <div class="e"><a href="book7.html"><img src="img/51.jpg" width="250" height="360"></a>
    <div class="g"><a href="book7.html"><p class="l1">我与地坛</p></a>
    <p><img src="img/44.PNG"></p>
<p> 作者：史铁生</p></div>
</div></li>
<li>
    <div class="e"><a href="book8.html"><img src="img/28.jpg" width="250" height="360"></a>
    <div class="g"><a href="book8.html"><p class="l1">白夜行</p></a>
    <p><img src="img/43.PNG"></p>
    <p>作者：东野圭吾</p></div></div>
    </li>
<li>
    <div class="e"><a href="book9.html"><img src="img/49.jpg" width="250" height="360"></a>
    <div class="g"><a href="book9.html"><p class="l1">檀香刑</p></a>
    <p><img src="img/45.PNG"></p>
    <p>作者：莫言</p></div></div>
    </li>
<li>
    <div class="e"><a href="book10.html"><img src="img/30.jpg" width="250" height="360"></a>
    <div class="g"><a href="book10.html"><p class="l1">假面山庄</p></a>
    <p><img src="img/47.PNG"></p>
    <p>作者：东野圭吾</p></div></div>
    </li>
    </ul></div>
<footer>
  <p>版权所有 &copy; 2024 我的读书网站</p>  
  <ul class="friend-links">  
      <li><a href="guanyuwomen.html">关于我们</a></li>  
      <li><a href="falvshengming.html">法律声明</a></li>  
      <li><a href="bangzuzhongxin.html">帮助中心</a></li>  
      <!-- 更多友情链接项 -->  
  </ul> 
</footer>
<script src="swiper-bundle.min.js"></script>
<script>
    let inputs=document.querySelectorAll('input')
    var swiper = new Swiper(".mySwiper", {
      spaceBetween: 30,
      pagination: {
        el: ".swiper-pagination",
        clickable: true,
      },
    });
</script>

</body>
</html>
